<template>
  <div>
    <div @keyup.enter="getData()">
      <el-form :inline="true">
        <el-form-item>
          <el-input v-model="params.report_name" placeholder="报表名称查询" clearable></el-input>
        </el-form-item>
        <el-form-item>
          <el-button @click="getData()">查询</el-button>
        </el-form-item>
      </el-form>
    </div>

    <c-table
      border
      v-loading="loading"
      :stripe="false"
      :columns="tableColumns"
      :data="tableData"
      :height="dialogHeight"
    ></c-table>

    <div class="query-pagination">
      <div></div>
      <el-pagination
        layout="total, prev, pager, next, jumper"
        :current-page.sync="params.index"
        :page-size="params.size"
        :total="totalCount"
        @current-change="getData"
      ></el-pagination>
    </div>

    <el-dialog
      title=""
      :visible.sync="reportNormalVisible"
      top="30px"
      width="90%"
      append-to-body
      :close-on-click-modal="false"
    >
      <task-report-normal
        :task-report-data="reportNormalRow"
        :report-status="status"
        @success="handleSuccess"
      ></task-report-normal>
    </el-dialog>

    <el-dialog
      title=""
      :visible.sync="reportRiskVisible"
      top="30px"
      width="90%"
      append-to-body
      :close-on-click-modal="false"
    >
      <task-report-risk
        :task-report-data="reportRiskRow"
        :report-status="status"
        @success="handleSuccess"
      ></task-report-risk>
    </el-dialog>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import TaskReportNormal from '@/credit/views/county/index/myTask/TaskReportNormal'
import TaskReportRisk from '@/credit/views/county/index/myTask/TaskReportRisk'

export default {
  components: {
    TaskReportNormal,
    TaskReportRisk,
  },
  props: {
    visible: Boolean,
    status: {
      type: String,
      default: '0',
    },
  },
  data() {
    return {
      dialogHeight: 300,
      params: {
        index: 1,
        size: 10,
        'task_person.eq': '',
        'task_status.eq': '0',
      },
      order: {
        start_date: 'desc',
      },
      tableName: 'report_info_task',
      tableData: [],
      totalCount: 0,
      loading: false,
      tableColumns: [
        { attrs: { label: '报表名称', prop: 'report_name', align: 'center' } },
        { attrs: { label: '上传开始时间', prop: 'start_date', align: 'center' } },
        { attrs: { label: '上传截止时间', prop: 'end_date', align: 'center' } },
        { attrs: { label: '报表类型', prop: 'reportSetType', align: 'center' } },
        {
          attrs: { label: '操作', align: 'center' },
          operations: [{ name: '上传报表', event: this.handleEdit }],
        },
      ],

      reportNormalVisible: false,
      reportNormalRow: {},

      reportRiskVisible: false,
      reportRiskRow: {},
    }
  },
  computed: {
    ...mapGetters(['clientId']),
  },
  watch: {
    visible() {
      if (this.visible) {
        this.getData()
      }
    },
  },
  created() {
    this.dialogHeight = Math.max(300, window.innerHeight - 320)
    this.params['task_person.eq'] = this.clientId
    this.params['task_status.eq'] = this.status
  },
  mounted() {},
  methods: {
    getData(index = 1) {
      this.params.index = index
      this.loading = true
      this.$api
        .getData(this.$serviceName, this.tableName, this.params, this.order)
        .then(res => {
          const data = (res && res.data && res.data.data) || []
          this.tableData = data.map(item => this.dataAdapter(item))
          this.totalCount = (res && res.data && res.data.totalCount) || 0
        })
        .finally(() => {
          this.loading = false
        })
    },
    dataAdapter(item) {
      item.reportSetType = '月报'
      return item
    },
    beforeClose() {
      this.$emit('update:visible', false)
    },
    handleEdit(row) {
      if (+row.report_set_type === 4) {
        this.reportRiskRow = { ...row }
        this.reportRiskVisible = true
      } else {
        this.reportNormalRow = { ...row }
        this.reportNormalVisible = true
      }
    },
    handleSuccess() {
      this.reportNormalRow = {}
      this.reportNormalVisible = false

      this.reportRiskRow = {}
      this.reportRiskVisible = false

      this.getData()
    },
  },
}
</script>
<style lang="scss" scoped></style>
